 
<!-- 
 @Author: LW  
 @Date: 2021-01-15 14:24:32  
 @function:pdf阅读弹窗
  ---------------------------------------------------------- 
 @Last Modified by:   LW-2021-01-15 14:24:32 
 @Modified function:xxx 
 -->
<template>
  <div>
    <div class="pdf-tips" v-if="showTips">按【ESC】键或【鼠标点击空白处】可关闭PDF<el-button type="text"><i class="el-icon-close" @click="showTips=false"></i></el-button></div>
    <div id="pdf-content" :style="{top:pdfTop+'px'}"></div>
  </div>
</template>

<script>
//引用home界面相关的api[顶部导航/个人信息放在里面，如果不再拆分，个人信息/密码修改也放里面]
import PDFObject from "pdfobject";
export default {
  props: ["formInfo"],
  data() {
    return {
      pdfTop:40,
      showTips:true
    };
  },
  computed: {},
  //html加载完成之前，执行。执行顺序：父组件-子组件
  created() {},
  //html加载完成后执行。执行顺序：子组件-父组件
  //页面初始化方法
  mounted() {
  },
  beforeMount() {
    this.$nextTick(function () {
      PDFObject.embed(this.formInfo.url, "#pdf-content");
    });
  },
  methods: {
  },
};
</script>
<style lang="scss" scoped>
.pdf-tips{
    width: 80%;
    height: 140px;
    display: flex;
    justify-content: center;
    align-items: center;
    position:fixed;
    text-align: center;
    top:10%;
    left:10%;
    z-index: 999999999999;
    background: #fff;
}
#pdf-content{
    top: 40px;
    width: 80%;
    height: 85%;
    position: fixed;
    left:10%;
    z-index: 999999999999;
    background: #999;
}
</style>

